<template>
  <div>
    <query-page
      ref="detailTable"
      v-model:selectedKeys="selectedKeys"
      :form-component-config="formComponentConfig"
      :form-render-config="formRenderConfig"
      :form-render-keys="formRenderKeys"
      :table-component-config="tableComponentConfig"
      :table-render-config="tableRenderConfig"
      :table-render-keys="tableRenderKeys"
      :loading="isLoading"
      :data="renderData"
      :total="tableTotal"
      height="calc(100vh - 258px)"
      @selection-change="selectionChange"
      @query-data="getData"
    >
      <template #container-side>
        <!-- <a-button type="primary" @click="exportSearch">按查询条件导出</a-button>
        <a-button type="primary" @click="exportAll">全部导出</a-button> -->
      </template>
      <template #operate="{ record, rowIndex }">
        <a-button
          v-permission="['pms:receive:revokeConfirmation']"
          type="text"
          @click="cancelSubmit(record, rowIndex)"
          >撤销确认</a-button
        >
      </template>
    </query-page>
  </div>
</template>

<script lang="ts" setup>
  import { ref } from 'vue';
  import queryPage from '@/common/components/query-page/index.vue';
  import { info } from '@/common/utils/modal-promise';
  import {
    getPmsReceiveDetailPage,
    revokeConfirmation,
    // exportPmsReceiveDetail,
  } from '@/api/purchaseArrival/arrivalRegistration';
  import { Message } from '@arco-design/web-vue';
  // import dayjs from 'dayjs';
  import {
    formComponentConfig,
    formRenderConfig,
  } from '../moduleCommon/formComp/baseFormConfig';
  import {
    tableRenderConfig,
    tableComponentConfig,
  } from '../moduleCommon/tableComp/baseTableConfig';

  // 当前页面要渲染的查询条件
  const formRenderKeys = [
    'billNo',
    'mdsVendorId',
    'orderNo3',
    'mdsItemCode',
    'mdsItemName',
    'modelMark',
    'parentModel',
    'proMdsItemId',
    'specification',
    // 'xuqiulaiyuan', // TODO: 需求来源
    'sysOrderNo',
    'daohuodengji',
    // 'user', //  TODO: 未知字段采购履行员
    // 业务不要了
    // 'xuqiuhao', //  TODO: 未知字段需求号
    // 'xuqiudanwei', //  TODO: 未知字段需求单位
  ];
  // 当前表格要渲染哪些值
  const tableRenderKeys = [
    'secretLevel',
    'serialNo', // 序号
    'billNo', //
    'mdsVendorName', //
    'orderNo2',
    'sysOrderNo',
    'businessStatus',
    'mdsItemCode',
    'mdsItemName',
    'modelMark',
    'parentModel', // TODO: 父型号
    'proMdsItemCode',
    'mdsVendorName',
    'specification',
    'jishutiaojian',
    'invDeliverQty3',
    'pmsDeliverQty3',
    'cwxhsl',
    'invoiceNo',
    'mdsProjectCode',
    'editUserName',
    'editDate',
    'itemManufactureFactoryName',
    'itemManufactureFactoryCode',
    'dealerName',
    'dealerCode',
    'pmsPredictPrice',
    'deliverType',
    'itemState',
    'qualityFile',
    'sparePart',
    'instructions',
    'itemSerialNo',
    'urgencyDegree',
    'planSourceType',
    'operate',
  ];

  const detailTable = ref(null);
  const isLoading = ref(true);
  const tableTotal = ref(0);
  const renderData = ref<any[]>([]);
  const selectedKeys = ref([]);

  const getData = async (queryInfo: object) => {
    const page = detailTable.value.getStatus();
    isLoading.value = true;
    const { data } = await getPmsReceiveDetailPage({
      ...queryInfo,
      ...page,
      confirmFlag: 1, // 查询已确认的
    });
    renderData.value = data.list;
    tableTotal.value = data.total;
    isLoading.value = false;
  };
  const selectionChange = (val: string[]) => {
    console.log('selectedKeys', val);
  };
  const cancelSubmit = async (row) => {
    await info({
      title: '撤销确认',
      content: '您确定要撤销确认当前所选的数据？',
      okText: '确认',
    });
    await revokeConfirmation([row.id]);
    Message.success({
      content: '撤销确认成功！',
      duration: 5 * 1000,
    });
    getData({});
  };
  // const exportFun = async (query) => {
  //   try {
  //     const res = await exportPmsReceiveDetail(query);
  //     if (res.type !== 'application/json') {
  //       const elink = document.createElement('a');
  //       elink.download = `采购到货装箱单明细${dayjs()
  //         .format('YYYY-MM-DD_HH:mm:ss')
  //         .toString()}.xlsx`;
  //       elink.style.display = 'none';
  //       const blob = new Blob([res], { type: 'application/vnd.ms-excel' });
  //       elink.href = URL.createObjectURL(blob);
  //       document.body.appendChild(elink);
  //       elink.click();
  //       document.body.removeChild(elink);
  //     } else {
  //       // 正常情况下文件的下载是不会返回retCode的，如果发现有返回码，说明就是接口出了问题
  //       Message.error('导出失败');
  //     }
  //   } catch (error) {
  //     // eslint-disable-next-line @typescript-eslint/no-unused-vars
  //     Message.error('导出失败');
  //   }
  // };
  // const exportSearch = async () => {
  //   const page = detailTable.value.getStatus();
  //   exportFun(page);
  // };
  // const exportAll = async () => {
  //   exportFun({});
  // };
  defineExpose({ getData });
</script>

<style lang="less" scoped>
  @import url('../moduleCommon/common.less');
</style>
